<!DOCTYPE html>
<html lang="zh" xmlns:th="http://www.thymeleaf.org" xmlns:shiro="http://www.pollix.at/thymeleaf/shiro">
<head>
    <th:block th:include="include :: header('实验成绩列表')" />
</head>
<body class="gray-bg">
     <div class="container-div">
        <div class="row">
            <div class="col-sm-12 search-collapse">
                <form id="formId">
                    <div class="select-list">
                        <ul>
                            <li>
                                <label>实验名称：</label>
                                <input type="text" name="reportExperimentName" id="reportExperimentName"/>
                            </li>
                            <li>
                                <a class="btn btn-primary btn-rounded btn-sm" onclick="init()"><i class="fa fa-search"></i>&nbsp;搜索</a>
                                <a class="btn btn-warning btn-rounded btn-sm" onclick="$.form.reset()"><i class="fa fa-refresh"></i>&nbsp;重置</a>
                            </li>
                        </ul>
                    </div>
                </form>
            </div>

            <div class="col-sm-12 select-table table-striped" id="dataTable">
                <div style="text-align: center;" id="titleContent" hidden=""><h3>不好意思，没有开放的试验</h3></div>
            </div>
        </div>
    </div>
    <th:block th:include="include :: footer" />
    <script th:inline="javascript">
        var editFlag = [[${@permission.hasPermi('system:report:edit')}]];
        var removeFlag = [[${@permission.hasPermi('system:report:remove')}]];
        var prefix = ctx + "system/report";

        $(function () {
            var count=0;
            $.ajax({
                type : 'post',
                url : prefix + '/list',
                dataType : 'json',
                success: function (data) {
                    console.log(data)
                    $("#titleContent").attr("hidden", "true");
                    if(data.rows.length == 0){
                        $("#titleContent").attr("hidden", false);
                    }else{
                        for (var i = 0; i < data.rows.length; i++) {
                                var value1 = "<div class=\"col-md-3\" style=\"padding-top: 20px;\">\n" +
                                    "            <div class=\"card\">\n" +
                                    "                <img src='" + ctx + data.rows[i].experimentPhoto + "' style=\"width: 100%;height: 202px\"\n" +
                                    "                     class=\"card-img-top\" alt=\"...\">\n" +
                                    "                <div class=\"card-body\">\n" +
                                        "<br>\n"+
                                    "                    <h4 class=\"card-title\" >" + data.rows[i].experimentName + "</h4>\n" +
                                    /*"                    <p class=\"card-text\"><span class=\"glyphicon glyphicon-play-circle\"></span><span>"+data.rows[i].professionName+"</span></p>\n" +*/
                                    "                    <div style=\"float: right;padding-right: 20px\"><button class='btn btn-primary' onclick='orderExperiment(this.value)' value='"+data.rows[i].experimentId+"'>开始实验</button></div>\n" +
                                    "                </div>\n" +
                                    "            </div>\n" +
                                    "        </div>";
                                $("#dataTable").append(value1)
                            }
                        }
                    }

            })
        })

        /*调用获取信息，初始化页面内容*/
        function init(){
            $("#dataTable").html('');
            console.log($("#reportExperimentName").val())
            var count=0;
            $.ajax({
                type : 'post',
                data : {
                    'experimentName' : $("#reportExperimentName").val()
                },
                url : prefix + '/list',
                dataType : 'json',
                success: function (data) {
                    $("#titleContent").attr("hidden", "true");
                    if(data.rows==null){
                        $("#titleContent").attr("hidden", false);
                    }else{
                        for (var i = 0; i < data.rows.length; i++) {
                            var value1 = "<div class=\"col-md-3\" style=\"padding-top: 20px;\">\n" +
                                "            <div class=\"card\">\n" +
                                "                <img src='" + ctx + data.rows[i].experimentPhoto + "' style=\"width: 100%;height: 202px\"\n" +
                                "                     class=\"card-img-top\" alt=\"...\">\n" +
                                "                <div class=\"card-body\">\n" +
                                "<br>\n"+
                                "                    <h4 class=\"card-title\" >" + data.rows[i].experimentName + "</h4>\n" +
                                /*"                    <p class=\"card-text\"><span class=\"glyphicon glyphicon-play-circle\"></span><span>"+data.rows[i].professionName+"</span></p>\n" +*/
                                "                    <div style=\"float: right;padding-right: 20px\"><button class='btn btn-primary' onclick='orderExperiment(this.value)' value='"+data.rows[i].experimentId+"'>开始实验</button></div>\n" +
                                "                </div>\n" +
                                "            </div>\n" +
                                "        </div>";
                            $("#dataTable").append(value1)
                        }
                    }
                }
            })
        }


        /**
         * 开始试验
         * @param value
         */
        function orderExperiment(value){
            /*$.modal.confirm("开始试验,请先提交在线实验最后提交实验报告。", function() {*/
                window.location.href = prefix + "/startExperiment?experimentId="+value;
            /*})*/
            /*$.modal.msg("已预约实验，则更新预约信息");
            setTimeout(function () {
                $.modal.open('预约实验',ctx+"/system/onlineExperimentOrder/add?id="+value,800,450);
            }, 1000);*/
        }
    </script>
</body>
</html>